<template>
  <v-layout type="main">
    <el-form class="form" ref="form" :model="addForm" :rules="submitRules" label-width="124px">
      <el-form-item label="品牌" prop="brand">
        <el-input type="text" v-model="addForm.brand" />
      </el-form-item>
      <el-form-item label="型号" prop="model">
        <el-input type="text" v-model="addForm.model" />
      </el-form-item>
      <el-form-item label=" ">
        <el-button class="none-type" @click="submit">确定</el-button>
      </el-form-item>

    </el-form>
  </v-layout>
</template>

<script>
import { addGpuModel, putGpuModel, gpuModelDetail } from '@/api/gpu'
export default {
  data() {
    return {
      addForm: {
        productType: '1'
      },
      submitRules: {
        brand: [
          { required: true, message: "请品牌名称" },
        ],
        model: [
          { required: true, message: "请填写型号" },
        ],
      },
      gpuModelMap: []
    };
  },
  async created() {
    this.getData()
  },
  methods: {
    async getData() {
      if (this.$route.query.id) {
        let res = await gpuModelDetail({ id: this.$route.query.id })
        this.addForm = res.data
      }
    },
    async submit() {
      this.$refs.form.validate(async (valid) => {
        if (valid) {
          if (this.$route.query.id) {
            await putGpuModel({ ...this.addForm })
          } else {
            await addGpuModel({ ...this.addForm })
          }
          this.$router.push({
            path: '/gpu'
          })
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>
.short-append {
  width: 80px;
  text-align: center;
}
</style>